<template>
	<view style="background-size:100% 100%;text-align: center;height: 100%;" :style="{backgroundImage:`url(${list.my_sleep_time!=null?img2:img3})`}">
		<!-- <image src="https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/nanzhong/bg.png" style="width: 100%;" mode="widthFix"></image> -->
		<view style="color: #fff; font-size:30px;font-weight: bold;padding-top: 30px;" class="flex a-t j-t">
			<image :src="list.my_sleep_time==null?'https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/nanzhong/taiyang.png':'https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/nanzhong/yueliang.png'" mode="widthFix" style="width: 40px;"></image>{{time}}
		</view>
		<view style="color: #fff; font-size:14px;margin-top: 20px;">
			{{riqi}}
		</view>
		<view class="flex" style="margin-top: 20px;">
			<view style="width: 50%;">
				<image :src="vuex_user_content.my_avatar" style="width: 80px;border-radius: 50%; border: #fff solid 5px ; box-sizing: border-box;height: 80px; " mode=""></image>
				<view class="cf f16">
					{{list.my_sleep_time!=null?'我睡了':'清醒中'}}
					<view v-if="list.my_sleep_time!=null">
						已睡{{list.my_sleep_time.h}}时{{list.my_sleep_time.i}}分
					</view>
				</view>
			</view>
			<view style="width: 50%;">
				<image :src="vuex_user_content.ta_avatar" style="width: 80px;border-radius: 50%; border: #fff solid 5px ; box-sizing: border-box;height: 80px; " mode=""></image>
				<view class="cf f16">
					{{list.ta_sleep_time!=null?'Ta睡了':'清醒中'}}
					<view v-if="list.ta_sleep_time!=null">
						已睡{{list.ta_sleep_time.h}}时{{list.ta_sleep_time.i}}分
					</view>
				</view>
			</view>
			<!-- <image src="https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/logo.png" style="width: 80px;border-radius: 50%; border: #fff solid 5px ; box-sizing: border-box; " mode="widthFix"></image> -->
		</view>
		<view style="width: 240px;margin:40px auto 0 auto;">
			<u-button @click="shui" style="width: 240px;" type="warning" shape="circle">{{list.my_sleep_time?'我醒了':'我睡了'}}</u-button>
		</view>
		<view style="width: 240px;margin:40px auto 0 auto;">
			<u-button  open-type="share" style="width:240px;" type="success" shape="circle">{{list.ta_sleep_time?'叫Ta醒':'叫Ta睡'}}</u-button>
		</view>

	</view>
</template>

<script>
	// import img1 from "https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/nanzhong/bg.png"
	export default {
		data() {
			return {
				time:'',
				riqi:'',
				img2:'https://yunkeososyunchuc.bc8t.cn/lianaikongjian/static/nanzhong/bg.png',
				img3:'',
				s:0,
				list:{}
			}
		},
		onLoad() {
			uni.setNavigationBarColor({
			    frontColor: '#000000',
			    backgroundColor: '#ffffff',
			})
			this.getime()
			this.$u.api.config().then((res)=>{
				this.img2=res.clock_background_one
				this.img3=res.clock_background_two
			})
		},
		 onShareAppMessage(res) {
		    if (res.from === 'button') {// 来自页面内分享按钮
		      console.log(res.target)
		    }
		    return {
		      title: '该睡了',
		      path: '/pages/content/content'
		    }
		  },
		onShow() {
			this.sj()
		},
		methods: {
			shui(){
				let sleep=1
				this.sj(sleep)
			},
			async sj(e){
				let data={
					my_space_id:this.vuex_user_content.id
				}
				if(e==1){
					data.sleep=1
				}
				let res = await this.$u.api.sleep(data)
				console.log(res)
				this.list=res
			},
			getime(){
				var myDate=new Date()
				this.s=myDate.getMinutes()
				let f=myDate.getMinutes()<10?('0'+myDate.getMinutes()):myDate.getMinutes()
				this.time=myDate.getHours()+':'+f
				this.riqi=myDate.getFullYear()+'年'+(myDate.getMonth()+1)+'月'+myDate.getDate()+'日'+' '+'星期'+myDate.getDay()
				myDate.toLocaleString( );
				console.log(myDate.toLocaleDateString(),myDate.getDay())
				setTimeout(()=>{
					this.getime()
				},1000)
			}
		}
	}
</script>

<style>
page{
	height: 100%;
		/* background: #fec5ce; */
		/* background-image: linear-gradient(to right, #87CEEB , rgb(255,192,203)); */
	}

</style>
